<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/jsp/comm_css_include.jsp"%>
<!-- fileInput  dpqc -->
<link href="${basePath}/js/fileInput/css/fileinput.css" media="all" rel="stylesheet" type="text/css" />
<!doctype html>
<html>
<head>
	<style type="text/css">
	   .gray-bg
	   {
	     background-color: #fff;
	   }
	</style>
</head>
<body class="gray-bg">
	 <div class="ibox-content">
		<form class="form-horizontal m-t" id="commentForm">
			<table cellpadding="0" cellspacing="0" border="0" bordercolor="#3B95C8"  width="100%">
				<tr>
				    <td width="23%" align="right">
				    	<label class="col-sm-3 control-label rp">角色名称：</label>
				    </td>
					<td width="77%">
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="roleName" name="roleName"  type="text" class="form-control" aria-required="true" required="required"   minlength="1" maxlength="64" placeholder="请输入角色名称(必填)">
		    				</div>
	    				</div>
					</td>
				</tr>
				
				<tr>
				    <td width="23%" align="right">
				    	<label class="col-sm-3 control-label rp">角色代码：</label>
				    </td>
					<td width="77%">
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="roleCode" name="roleCode"  type="text" class="form-control" aria-required="true" required="required"  minlength="1" maxlength="64" placeholder="请输入角色代码(必填)">
		    				</div>
	    				</div>
					</td>
				</tr>
				
				<tr>
				    <td width="23%" align="right">
				    	<label class="col-sm-3 control-label rp">备注：</label>
				    </td>
					<td width="77%">
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<textarea id="remarks" name="remarks" cols="20" rows="5" type="text" class="form-control" aria-required="true" placeholder="请输入备注" ></textarea>
		    				</div>
	    				</div>
					</td>
				</tr>

			</table>
			<table cellpadding="0" cellspacing="0" border="0" bordercolor="#3B95C8"  width="100%">
				<tr>
					<td width="100%" align="center">
						 <div class="ibox-content">
				              <button type="button" class="btn dpbtn_green" onclick="rolesave();">确定</button>
				              <button type="reset" class="btn dpbtn_red">重置</button>
				          </div>
					</td>
				</tr>
			</table>
		</form>
	</div>
	
	
	<!-- public quote -->
    <%@include file="/jsp/comm_js_include.jsp"%>

 	<!-- custom js -->
    
    
    <!-- file input zhang -->
    <script src="${basePath}/js/fileInput/js/fileinput.js" type="text/javascript"></script>
    <script src="${basePath}/js/fileInput/js/locales/zh.js" type="text/javascript"></script>
    
    <!--
    	作者：zhangpp
    	时间：2017-04-06
    	描述：js
    -->
    <script type="text/javascript">
	    
	    var winWidth = $(window).width();
		var winHeight = $(window).height();
		
		var rolesave = function()
		{
			var validstatus = $("#commentForm").valid();
	    	
	    	if(validstatus)
	    	{
	    		var data = $('#commentForm').serialize();

    			layer.confirm('您确认要增加吗？', {
   		  			  btn: ['确定','取消'] //按钮
   				},function(){
   					layer.closeAll();
   					$.dpAjax({
   		 	    		url:'${basePath}/role/add',
   		     			data:data,
   		     			success: function(datas){
   			     			  if(datas.flag == "100100")
   		 					  {
   		     				 	  layer.msg("添加执行成功！", {icon: 6});
   		     				 	  parent.layer.close(parent.addlayer);
   		 						  return;
   		 					  }
   		 					  if(datas.flag == "100200")
   		 	                  {
   		 						  $.fn.showDatas({"datas":datas});
   		 	                	  return;
   		 	                  }
   		 					  layer.msg(datas.message, {icon: 2});
   		                 }
   		 	    	});
   					   					
   				});
	    		
	    	}
		}
		
		$(function(){
	  		// 验证
	  	        $("#commentForm").validate({
	  	            rules: {
	  	            	roleName: {
	  	                    required: true,
	  	                },
	  	              roleCode: {
	  	                    required: true,
	  	                },
	  	            },
	  	            messages: {
	  	            	roleName: {
	  	            		required: "角色名称必填",
	  	                },
	  	               roleCode: {
	  	                    required: "角色代码必填",
	  	                },
	  	            },
	  	            //重写showErrors
	  	            showErrors: function (errorMap, errorList) {
	  	                
	  	                $.each(errorList, function (i, v) {
	  	                    layer.tips(v.message, v.element, { time: 1500 });
	  	                    return false;
	  	                });  
	  	            },
	  	            /* 失去焦点时验证 */
	  	            onfocusout: function(element) { $(element).valid(); },
	  	            /*  键盘抬起不验证 */
	  	            onkeyup:false,
	  	        });
		 });

    </script>
</body>
</html>